﻿<form class="layui-form zadmin-search-area input">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label for="roleName" class="layui-form-label">名称</label>
            <div class="layui-input-inline">
                <input type="text" name="roleName" autocomplete="off"
                       id="roleName" class="layui-input">
            </div>

            <button lay-submit="" lay-filter="search" class="layui-btn layui-btn-sm layui-btn-primary table-action">
                <i class="zadmin-icon zadmin-icon-search"></i>
            </button>
        </div>
    </div>
</form>

<table class="layui-hide" id="role-table"></table>
@section script{

    <script type="text/html" id="toolbar">
        <button type="button" class="layui-btn layui-btn-normal" lay-event="add">
            <i class="zadmin-icon zadmin-icon-xinzeng zadmin-oper-area"></i>
            新增
        </button>
    </script>

    <script type="text/html" id="column-toolbar">
        <a lay-event="grant">
            <i class="zadmin-icon zadmin-icon-quanxian zadmin-oper-area zadmin-blue" title="授权"></i>
        </a>
        <a lay-event="edit">
            <i class="zadmin-icon zadmin-icon-edit-square zadmin-oper-area zadmin-blue" title="编辑"></i>
        </a>

        <a lay-event="del">
            <i class="zadmin-icon zadmin-icon-delete zadmin-oper-area zadmin-red" title="删除"></i>
        </a>
    </script>
    <script>
        layui.use(["table", "form", "layer"], function (table, form, layer) {

            table.render({
                elem: '#role-table'
                , url: '/Role/Index',
                method: "post"
                , cellMinWidth: 80
                , page: true
                , toolbar: '#toolbar'
                , even: true
                , defaultToolbar: []
                , cols: [
                    [
                        { type: 'numbers', title: '序号', width: "5%" }
                        , { field: 'id', title: 'ID', hide: true }
                        , { field: 'roleName', title: '角色名称' }
                        , { field: 'description', title: '描述' }
                        , { title: '操作', fixed: 'right', align: 'center', toolbar: '#column-toolbar' }
                    ]
                ]
            });

            table.on('toolbar', function (obj) {
                var event = obj.event;
                if (event === 'add') {
                    add();
                }
            });

            table.on('tool', function (obj) {
                var data = obj.data;
                var event = obj.event;

                if (event === 'edit') {
                    edit(data.roleId);
                } else if (event === 'grant') {
                    layer.open({
                        type: 2,
                        title: "授权菜单",
                        area: ["500px", "85%"],
                        shadeClose: true,
                        content: '/Role/Grant',
                        btn: ['确认选择'],
                        success: function (layero, index) {
                            dtree.render({
                                obj: $(layero).find("#menuTree"),
                                url: "/data/menu/tree.json",
                                dataStyle: "layuiStyle",
                                method: "GET",
                                dot: false,
                                checkbar: true, // 开启复选框
                                menubar: true,
                                response: {
                                    statusCode: 0,
                                    message: "msg",
                                    treeId: "id",
                                    parentId: "parentId",
                                    title: "name"
                                }
                            });
                        },
                        yes: function (index, layero) {
                            var flag = true;
                            var nodes = dtree.getCheckbarNodesParam("menuTree"); // 获取选中值
                            var ids = [];
                            for (var key in nodes) {
                                var node = nodes[key];
                                ids.push(node.nodeId);
                            }
                            console.log("授权菜单 ID: " + ids);
                            layer.msg("授权成功", { icon: 6 });
                            layer.close(index);

                        }
                    });
                } else if (event === 'grant-operator') {
                    layer.open({
                        type: 1,
                        title: "授权功能",
                        area: ["350px", "85%"],
                        shadeClose: true,
                        content: '<ul id="operatorTree" class="dtree" data-id="0"></ul>',
                        btn: ['确认选择'],
                        success: function (layero, index) {
                            dtree.render({
                                obj: $(layero).find("#operatorTree"),
                                url: "/data/operator/tree.json",
                                dataStyle: "layuiStyle",
                                initLevel: 5,   // 初始打开节点级别
                                method: "GET",
                                dot: false,
                                checkbar: true, // 开启复选框
                                menubar: true,
                                response: {
                                    statusCode: 0,
                                    message: "msg",
                                    treeId: "id",
                                    parentId: "parentId",
                                    title: "name"
                                }
                            });
                        },
                        yes: function (index, layero) {
                            var flag = true;
                            var nodes = dtree.getCheckbarNodesParam("operatorTree"); // 获取选中值
                            var ids = [];
                            for (var key in nodes) {
                                var node = nodes[key];
                                ids.push(node.nodeId);
                            }
                            console.log("授权功能 ID: " + ids);
                            layer.msg("授权成功", { icon: 6 });
                            layer.close(index);
                        }
                    });
                } else if (event === 'del') {
                    layer.confirm("确定删除角色吗?", { icon: 3, title: '提示' },
                        function (index) {// 确定回调
                            obj.del();
                            parent.layer.msg("删除成功", { icon: 6 });
                            layer.close(index);
                        }, function (index) {//取消回调
                            layer.close(index);
                        }
                    );
                }
            });

            //搜索
            form.on('submit(search)', function (form) {
                table.reload('role-table', {
                    where: form.field
                });
                return false;
            });

            function add() {
                let add_index = layer.open({
                    content: "/Product/Create",
                    title: "新增商品",
                    type: 2,
                    maxmin: true, // 允许全屏最小化
                    end: function () {
                        table.reload('product-table');
                    }
                });
                layer.full(add_index);
            }
        });

    </script>
}